<template>
  <div class="wss-container">
    <NewCard title="标签设置">
      <div class="labelSettings">
        <el-form
          :model="ruleForm"
          :rules="rules"
          ref="ruleForm"
          label-width="200px"
          class="form"
          label-position="left"
        >
          <el-form-item label="用户标签标签上限" prop="userMax">
            <el-input
              maxlength="8"
              v-model.number="ruleForm.userMax"
            ></el-input>
          </el-form-item>
          <el-form-item label="用户标签标签下限" prop="userMin">
            <el-input
              maxlength="8"
              v-model.number="ruleForm.userMin"
            ></el-input>
          </el-form-item>
          <el-form-item label="专家标签数上限" prop="expertMax">
            <el-input
              maxlength="8"
              v-model.number="ruleForm.expertMax"
            ></el-input>
          </el-form-item>
          <el-form-item label="专家标签数下限" prop="expertMin">
            <el-input
              maxlength="8"
              v-model.number="ruleForm.expertMin"
            ></el-input>
          </el-form-item>

          <el-form-item>
            <el-button
              type="primary"
              v-hasPermi="['base:rangeConfig:editLabel']"
              @click="submitForm('ruleForm')"
              >保存</el-button
            >
            <el-button
              v-hasPermi="['base:rangeConfig:editLabel']"
              @click="resetForm('ruleForm')"
              >重设</el-button
            >
          </el-form-item>
        </el-form>
      </div>
    </NewCard>
  </div>
</template>
<script>
import {
  getlabelRangeConfigApi,
  getlabelRangeEditApi,
} from "@/wss/newApi_3-24/base/rangeConfig.js";
import NewCard from "../../../components/newCard.vue";

export default {
  components: { NewCard },
  data() {
    return {
      ruleForm: {
        userMax: "",
        userMin: "",
        expertMax: "",
        expertMin: "",
      },
      rules: {
        userMax: [
          {
            required: true,
            message: "请输入用户标签选择标签上限",
            trigger: "blur",
            type: "number",
          },
        ],
        userMin: [
          {
            required: true,
            message: "请输入用户标签选择标签下限",
            trigger: "blur",
            type: "number",
          },
        ],
        expertMax: [
          {
            required: true,
            message: "请输入专家标签数上限",
            trigger: "blur",
            type: "number",
          },
        ],
        expertMin: [
          {
            required: true,
            message: "请输入专家标签数下限",
            trigger: "blur",
            type: "number",
          },
        ],
      },
    };
  },
  created() {
    this.getlabelListLabelFn();
  },
  methods: {
    // 获取list
    async getlabelListLabelFn() {
      let { rows, code } = await getlabelRangeConfigApi();
      if (code != 200) return;
      let myRows = JSON.parse(JSON.stringify(rows));
      myRows.forEach((item) => {
        if (item.type == "label_user") {
          this.userlabelObj = item;
          this.ruleForm.userMax = item.max;
          this.ruleForm.userMin = item.min;
        } else if (item.type == "label_expert") {
          this.ruleForm.expertMax = item.max;
          this.ruleForm.expertMin = item.min;
        }
      });
      this.paramsLabel = myRows;
    },
    async submitForm(attr) {
      await this.$refs[attr].validate();
      const ruleForm = this.ruleForm;
      this.paramsLabel.forEach((item) => {
        if (item.type == "label_user") {
          item.min = ruleForm.userMin;
          item.max = ruleForm.userMax;
        } else if (item.type == "label_expert") {
          item.min = ruleForm.expertMin;
          item.max = ruleForm.expertMax;
        }
      });
      let { code, msg } = await getlabelRangeEditApi(this.paramsLabel);
      if (code != 200) return;
      this.$message({
        type: "success",
        message: msg,
      });
    },
    resetForm(formName) {
      this.ruleForm = {
        userMax: "",
        userMin: "",
        expertMax: "",
        expertMin: "",
      };
      this.$refs[formName].resetFields();
    },
    resetForm(formName) {
      this.$refs[formName].resetFields();
    },
  },
};
</script>

<style lang="scss" scoped>
.labelSettings {
  padding-top: 20px;
  background-color: #ffffff;
  .form {
    width: 800px;
  }
}
</style>